﻿<style>
    [v-cloak] {
        display: none;
    }
</style>
<footer id="floot" v-cloak  class="el-floot-font">
    <div style="float:left;width:180px;padding-left:80px;font-size:14px;">
        当前登录：{{user.User_Name}}
    </div>
    <div style="float:left;width:220px;font-size:14px;">
        登录时间：{{user.LoginTime}}
    </div>
    <div style="float:left;width:300px;padding-left:20px;font-size:14px;">
        当前时间：<span>{{dateTime.year}}-{{dateTime.month}}-{{dateTime.day}} &nbsp;&nbsp;{{dateTime.time}}</span>
    </div>
</footer>
<script>
    new Vue({
        el: '#floot',
        data() {
            return {
                dateTime: {
                    year: '',
                    month: '',
                    day: '',
                    week: '',
                    time: ''
                },//时间
                user: {
                    LoginTime: '',
                    User_Name:''
                },//登录信息
            }
        },
        methods: {
            appendZero(obj) {
                if (obj < 10) {
                    return "0" + obj;
                } else {
                    return obj;
                }
            },//日期不满10补0
        },
        mounted() {
            var _this = this; //声明一个变量指向Vue实例this，保证作用域一致
            _this.dateTime.year = new Date().getFullYear();
            _this.dateTime.month = (new Date().getMonth() + 1 < 10 ? '0' + (new Date().getMonth() + 1) : new Date().getMonth() + 1);
            _this.dateTime.day = (new Date().getDate() + 1 < 10 ? '0' + (new Date().getDate() + 1) : new Date().getDate() + 1)-1;        
            setInterval(function () {
                _this.dateTime.time = _this.appendZero(new Date().getHours()) + ":" + _this.appendZero(new Date().getMinutes()) + ":" + _this.appendZero(new Date().getSeconds());
            }, 1000);
            var userInfo = JSON.parse(localStorage.getItem('userInfo'));
            this.user.LoginTime = localStorage.getItem("loginTime")
            //this.user.User_Name = userInfo.Name;
        },//获取时间登录人员
    })
</script>
